import presetWeapp from "unocss-preset-weapp";
import {
  extractorAttributify,
  transformerClass,
} from "unocss-preset-weapp/transformer";
import transformerDirectives from "@unocss/transformer-directives";
const { presetWeappAttributify, transformerAttributify } =
  extractorAttributify();

// 主题配置
import { lightTheme } from "./src/styles/variables.js";

export default {
  presets: [
    // https://github.com/MellowCo/unocss-preset-weapp
    presetWeapp(),
    // attributify autocomplete
    presetWeappAttributify(),
  ],
  // 快捷类名组合
  shortcuts: [
    {
      center: "flex justify-center items-center",
      "bg-common": "bg-white",
      "text-common": "color-text-1 text-size-3",
    },
  ],
  // 重置主题配置
  theme: {
    // 调色板配置
    colors: {
      link: lightTheme.link,
      fill: lightTheme.fill,
      line: lightTheme.line,
      text: lightTheme.colorText,
      primary: lightTheme.primary,
      success: lightTheme.success,
      warning: lightTheme.warning,
      danger: lightTheme.danger,
    },
    // 文字大小配置
    fontSize: lightTheme.textSize,
    // 圆角配置
    borderRadius: lightTheme.rounded,
  },
  // 规则（自定义主题配置）
  rules: [
    // 阴影配置
    [
      /^shadow-(.*)$/,
      ([, c], { theme }) => {
        const shadowObj = lightTheme.shadow;
        if (shadowObj[c]) return { "box-shadow": shadowObj[c] };
      },
    ],
    
  ],
  transformers: [
    // https://github.com/MellowCo/unocss-preset-weapp/tree/main/src/transformer/transformerAttributify
    transformerAttributify(),
    // https://github.com/MellowCo/unocss-preset-weapp/tree/main/src/transformer/transformerClass
    transformerClass(),
    transformerDirectives(),
  ],
};
